<template>
  <view class="index">
    <view class="list-content">
      <easyDataList :data-list="dataList" :is-loading="isLoading" :is-more="isMore" :is-reloding="isReloding" @list-item-click="toDetail" @load-more="loadMore" @refresh="refresh">
        <view class="data-item" slot-scope="{scope}">
          <view>
            <view class="title">{{scope.workCode}}</view>
            <view class="device-name">{{scope.eqName}}</view>
            <text class="time">{{scope.createTime}}</text>
            <uni-icons class="icon-right" type="forward" size="16"></uni-icons>

          </view>
        </view>
      </easyDataList>
      <!-- <scroll-view refresher-enabled scroll-y :refresher-triggered="isReloding" @refresherrefresh="refresh"
        @scrolltolower="loadMore">
        <uni-swipe-action>
          <uni-swipe-action-item v-for="data in dataList" :key="data.workId">
            <view class="list-item" @click="toDetail(data)">
              <view>
                <view class="title">{{data.workCode}}</view>
                <view class="device-name">{{data.eqName}}</view>
                <text class="time">{{data.createTime}}</text>
                <uni-icons class="icon-right" type="forward" size="16"></uni-icons>

              </view>
            </view>
          </uni-swipe-action-item>
        </uni-swipe-action>
      </scroll-view> -->
    </view>
  </view>
</template>

<script>
  import easyDataList from '../../components/list/easyDataList.vue'
  import {
    getEquipmentInfo,
    getOrderList
  } from '../../api/device/device.js'
  import listMixins from '../order/list-mixins.js'

  export default {
    components: {
      easyDataList
    },
    mixins: [listMixins],
    data() {
      return {
        pageData: {
          pageNum: 1,
          pageSize: 10,
        },
      };
    },
    created() {},
    methods: {
      async getData() {
        this.isLoading = true
        const param = {
          ...this.pageData
        }
        const res = await getOrderList(param).catch(() => {
          this.isReloding = false
        })
        this.isReloding = false
        if (res.code === 200) {
          this.dataList = [...this.dataList, ...res.rows]
          this.isMore = !(this.dataList.length > res.total)
        }
        console.log(res)
      },
      addNew() {
        uni.navigateTo({
          url: `/pages/order/add-new/addNew`
        })
      },
      toDetail(data) {
        uni.navigateTo({
          url: `/pages/order/order-detail/orderDetail?workId=${data.workId}`
        })
      },
    }
  }
</script>

<style lang="scss" scoped>
  .index {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background-color: white;

    .list-content {
      flex: 1;
      overflow: hidden;

      .data-item {
        padding: 10px;

        >view {
          position: relative;
          padding-right: 26px;

          .title,
          .device-name {
            font-size: 14px;
            line-height: 1.5;
          }

          .device-name {
            margin-top: 10px;
          }

          .time {
            font-size: 12px;
            margin-top: 10px;
            line-height: 1;
            display: block;
            color: #ccc;
          }

          .icon-right {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            color: #ccc !important;
            display: block;
            right: 0;
          }

        }
      }

      // uni-scroll-view {
      //   height: 100%;

      //   /deep/.uni-scroll-view-refresher {
      //     background-color: #f1f1f1 !important;
      //   }

      //   /deep/.uni-swipe {
      //     border-bottom: 1px solid #f1f1f1;

      //     .uni-swipe_text--center {
      //       .list-item {
      //         padding: 10px;

      //         >view {
      //           position: relative;
      //           padding-right: 26px;

      //           .title,
      //           .device-name {
      //             font-size: 14px;
      //             line-height: 1.5;
      //           }

      //           .device-name {
      //             margin-top: 10px;
      //           }

      //           .time {
      //             font-size: 12px;
      //             margin-top: 10px;
      //             line-height: 1;
      //             display: block;
      //             color: #ccc;
      //           }

      //           .icon-right {
      //             position: absolute;
      //             top: 50%;
      //             transform: translateY(-50%);
      //             color: #ccc !important;
      //             display: block;
      //             right: 0;
      //           }

      //         }
      //       }

      //     }

      //     .uni-swipe_button-group.button-group--right {
      //       align-items: center;

      //       .del {
      //         height: 100%;
      //         padding: 0 15px;
      //         background-color: red;
      //         color: white;
      //         display: flex;
      //         align-items: center;
      //       }
      //     }

      //   }
      // }
    }

    .btn-content {
      padding: 10px;
    }
  }
</style>
